<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>历史统计</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
    <script type="text/javascript" src="../../layuiadmin/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../../layuiadmin/layui/xadmin.js"></script>
    <script type="text/javascript" src="../../layuiadmin/js/system/jquery.min.js"></script>
    <script src="../../layuiadmin/js/system/jquery.cookie.js"></script>
    <script>
        $(function () {
            var hrName = $("#hrName");
            $.post("http://localhost:8080/user/getByName",
                function (msg) {
                    for (var i = 0; i < msg.length; i++) {
                        var option = $("<option value=" + msg[i].empId + ">" + msg[i].empName + "</option>");
                        hrName.append(option);
                        layui.use('form', function () {
                            var form = layui.form;
                            form.render("select");
                        });
                    }
                })
        })
    </script>
</head>
<body>
<div class="layui-form" id="form">
    <div class="demoTable">
        <div class="layui-form" wid100 id="divData" style="margin-top: 10px">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">收支人:</label>
                    <div class="layui-input-inline">
                        <select name="modules" lay-verify="required" lay-search="" id="hrName">
                            <option value="-1"></option>
                        </select>
                    </div>
                </div>
                <button class="layui-btn" data-type="reload" type="button">搜索</button>
               </div>
            <div class="layui-card">
                <div class="layui-card-header"></div>
                <div class="layui-card-body">
                    <table class="layui-hide" id="test-table-simple"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../../layuiadmin/layui/layui.js"></script>
<script>
    function createrFormat(o){
        return o;
    }
    layui.use('table', function(){
        var table = layui.table;
        table.render({
            elem: '#test-table-simple'
            ,url: 'http://localhost:8080/finStatistics/historicalStatistics'
            ,cellMinWidth: 100 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            ,cols: [[
                {field:'name', title: '收支人'}
                ,{field:'begin_date',  title: '开始日期', sort: true}
                ,{field:'end_date',  title: '结束日期', sort: true}
                ,{field:'income_all',  title: '总收入', sort: true}
                ,{field:'expend_all', title: '总支出', sort: true}
                ,{field:'actual', title: '实际应提', sort: true}
            ]]
            ,id:'table'
        });

        var $=layui.$,active={
            reload:function () {
                var hrName=$("#hrName").val();
                //执行重载
                table.reload('table',{
                    where:{
                        empName:hrName
                    }
                },'data');
            }
        }
        $('.demoTable .layui-btn').on('click',function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        })
    });
</script>
</body>
</html>